<template>
    <div class="home-page">
        <div class="doctor-admin">
            <div class="list-item">教授姓名：<el-input v-model="doctor.dcname" placeholder="请输入教授姓名" style="width: 30%"></el-input></div>
            <div class="list-item">教授头衔：<el-input v-model="doctor.title" placeholder="请输入教授头衔" style="width: 30%"></el-input></div>
            <div class="list-item">教授邮箱：<el-input v-model="doctor.email" placeholder="请输入教授邮箱" style="width: 30%"></el-input></div>
            <div class="list-item">教授电话：<el-input v-model="doctor.phone" placeholder="请输入教授电话" style="width: 30%"></el-input></div>
            <div class="list-item">研究领域：<el-input v-model="doctor.area" placeholder="请输入研究领域" style="width: 30%"></el-input></div>
            <div class="list-item">通讯地址：<el-input v-model="doctor.address" placeholder="请输入通讯地址" style="width: 30%"></el-input></div>
            <div class="list-item list-item-flex">详细介绍：<el-input type="textarea" :autosize="{ minRows: 2, maxRows: 100}" v-model="doctor.descrip" placeholder="请输入详细介绍" style="width: 60%"></el-input></div>

            <div class="list-item list-item-flex">教授照片：<img :src="doctor.picture" style="width: 130px;height: 150px" v-show="uploadVisible"></div>
            <el-upload
                action="http://121.196.151.13:8088/upload/picture"
                list-type="picture-card"
                :on-preview="handlePictureCardPreview"
                :on-remove="handleRemove"
            :on-success="handleSuccess">
                <i class="el-icon-plus"></i>
            </el-upload>

            <el-dialog :visible.sync="dialogVisible">
                <img width="100%" :src="dialogImageUrl" alt="">
            </el-dialog><el-button type="primary" @click="submitDoctor">修改教授数据</el-button>
            <div class="lunbo-admin" style="margin-top: 20px">
                <el-table
                    :data="lunboList"
                    border
                    style="width: 100%"
                    fit>
                    <el-table-column
                        fixed
                        prop="id"
                        label="序号"
                        width="200">
                    </el-table-column>
                    <el-table-column
                        prop="picture"
                        label="图片"
                        width="800">
                        <template slot-scope="scope">
                            　　　　<img :src="scope.row.picture" style="height: 130px;width: 150px"/>
                            　　</template>
                    </el-table-column>
                    <el-table-column
                        fixed="right"
                        label="操作"
                        width="100">
                        <template slot-scope="scope">
                            <el-button @click="deleteLunbo(scope.row)" type="text" size="small">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>


            </div>

            <div>
                <el-button type="primary" size="small" @click="lunboVisible=true">添加轮播图</el-button>
                <el-dialog
                    title="添加轮播图"
                    :visible.sync="lunboVisible"
                    width="30%"
                    :before-close="handleClose">
                    <el-upload
                        action="http://121.196.151.13:8088/upload/picture"
                        list-type="picture-card"
                        :on-preview="handlePictureCardPreview"
                        :on-remove="handleRemove"
                        :on-success="lunboSuccess">
                        <i class="el-icon-plus"></i>
                    </el-upload>
                    <span slot="footer" class="dialog-footer">
    <el-button @click="lunboVisible = false">取 消</el-button>
    <el-button type="primary" @click="submitLunbo">确 定</el-button>
  </span>
                </el-dialog>
            </div>
            <div class="news-admin" style="margin-top: 10px">
                <el-table
                    :data="newsList"
                    border
                    style="width: 100%"
                    fit>
                    <el-table-column
                        fixed
                        prop="id"
                        label="序号"
                        width="200">
                    </el-table-column>
                    <el-table-column
                        prop="title"
                        label="标题"
                        width="200">
                    </el-table-column>
                    <el-table-column
                        prop="info"
                        label="内容"
                        width="200">
                    </el-table-column>
                    <el-table-column
                        prop="ttime"
                        label="时间"
                        width="200">
                    </el-table-column>
                    <el-table-column
                        fixed="right"
                        label="操作"
                        width="100">
                        <template slot-scope="scope">
                            <el-button @click="deleteNews(scope.row)" type="text" size="small">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>

            </div>
            <el-button type="primary" @click="addNews">添加新闻</el-button>








        </div>

        </div>
</template>

<script>
    import E from "wangeditor";
import ProjectIntro from "./components/projectIntro"
export default {
    name: "Editor",
    components:{
        ProjectIntro
    },
    data(){
        return {
            editor: null,
            ed: {
                editorContent:''
            },
            doctor: {
                id: '',
                dcname: '',
                title: '',
                email:'',
                phone: '',
                address: '',
                area: '',
                descrip: '',
                picture: '',

            },
            lunboList:[],
            lunbo:{
                picture:'',
                id:'',
            },
            props:{
                id: 1,
            },
            dialogImageUrl: '',
            dialogVisible: false,
            uploadVisible: true,
            lunboVisible:false,
            newsList:[],


        }
    },
    mounted(){
        this.getDoctor();
        this.getLunboList();
        this.getNewsList();


    },
    methods:{
        alertDate(){
            alert("1111");
        },
        addNews(){
            this.$router.push("/adminInfoDetail")
        },
        handleClose(done) {
            this.$confirm('确认关闭？')
                .then(_ => {
                    done();
                })
                .catch(_ => {});
        },
        deleteNews(row){
            const id = row.id
            var params = {
                id
            }
            this.centralControl.axios.centralControl(
                'deleteNews',
                res => {
                    if(res){
                        this.getNewsList();
                    }
                },
                params
            );
        },
        deleteLunbo(row) {
            const id = row.id
            var params = {
                id
            }
            this.centralControl.axios.centralControl(
                'deleteLunbo',
                res => {
                    if(res){
                        this.getLunboList();
                    }
                },
                params
            );

        },
        getNewsList(){
            this.centralControl.axios.centralControl(
                'getNews',
                res => {
                    this.newsList=res;
                },
                {}
            );
        },
        getLunboList(){
            this.centralControl.axios.centralControl(
                'getLunbo',
                res => {
                    this.lunboList=res;
                },
                {}
            );
        },
        submitDoctor(){
            this.centralControl.axios.centralControl(
                'updateDoctor',
                res => {
                    this.getDoctor();
                    this.$message({
                        message: '更新教授信息成功',
                        type: 'success'
                    });
                },
                this.doctor
            );
        },
        submitLunbo(){
            this.centralControl.axios.centralControl(
                'addLunbo',
                res => {
                    this.getLunboList();
                    this.lunboVisible = false;
                    this.$message({
                        message: '更新教授信息成功',
                        type: 'success'
                    });
                },
                this.lunbo
            );
        },
        getDoctor(){
            this.centralControl.axios.centralControl(
                'getDoctor',
                res => {
                    this.doctor=res;
                    this.dialogImageUrl = res.picture;
                },
                {}
            );
        },
        handleRemove(file, fileList) {
            console.log(file, fileList);
        },
        lunboSuccess(res){
            this.lunbo.picture = res.data[0];
            this.uploadVisible=false;
            console.log(this.doctor.picture+"11112343")
        },
        handleSuccess(res){
            this.doctor.picture = res.data[0];
            console.log(this.doctor.picture+"11112343")
        },
        handlePictureCardPreview(file) {
            this.dialogImageUrl = file.url;
            console.log(this.dialogImageUrl+"123141")
            this.dialogVisible = true;
        },
        // 跳转至更多课题组
        toIntro(){
            this.$router.push("/projectIntro")
        },
    }
}
</script>

<style lang="less">
.home-page {
    //background: #faffe1 url(../../assets/img/inbg.jpg) no-repeat center center;
    min-height: 810px;
    .list-item {
        margin-top: 10px;
    }
    .list-item-flex {
        display: flex;
        align-items: top;
    }
    .container{
        width: 1170px;
        margin: auto;

        .home-left {
            width:372px;
            float: left;
            .home-left-top {
                height: 290px;
                border-bottom: 2px solid #00659B;
                margin-bottom: 20px;
                .l-t-ctn {
                    background: url(../../assets/img/bgb.png) no-repeat center top;
                    width: 377px;
                    height: 244px;
                    position: relative;
                    text-align: center;
                    .small {
                        margin-top: 100px;
                    }
                }
            }
            .home-left-btm {
                background: url(../../assets/img/bgg.png) no-repeat center top;
                width: 304px;
                height: 400px;
                padding: 30px 40px;

                .inew-ul {
                    padding-top: 10px;
                    .tempWrap {
                        overflow: hidden;
                        position: relative;
                        height: 348px;
                    }
                    ul {
                        height: 754px;
                        margin: 0;
                        padding: 0;
                        position: relative;
                    }
                }
                .inew-ul{
                    padding-top: 10px;
                }
                .inew-ul ul li{
                    line-height: 28px;
                }
                .inew-ul ul li a{
                    font-size: 16px;
                    color: #444;
                    text-decoration: none;
                }
                .inew-ul ul li span{
                    font-size: 16px;
                    color: #444;

                }
            }
        }
        .home-right {
            float: right;
            width: 700px;
            background: url(../../assets/img/bg2.jpg) no-repeat center top;
            min-height: 714px;
            padding: 30px 40px;


        }
        .new-top {
            display: flex;
            justify-content: space-between;
            border-bottom: 2px solid #00659B;
            padding-bottom: 5px;
            height: 30px;
            .new-title{
                font-size: 18px;
                font-weight: bold;
                color: #00659B;
            }
            .new-more {
                display: block;
                color: #fff;
                background: url(../../assets/img/more.png) no-repeat left top;
                width: 48px;
                height: 22px;
                line-height: 20px;
                display: block;
                font-size: 12px;
                text-align: center;
                margin-top: 5px;
                text-decoration: none;
                cursor: pointer;
            }
        }
    }
}
</style>
